<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Content Center</title>
<link href="../css/bootstrap.css" rel="stylesheet">
<link href="../css/dashboard.css" rel="stylesheet">
<style type="text/css">
.pagination {
	padding: 5px;
	float: right;
	font-size: 12px;
}

.pagination a, .pagination a:link, .pagination a:visited {
	padding: 2px 5px;
	margin: 2px;
	border: 1px solid #428bca;
	text-decoration: none;
	color: #006699;
}

.pagination a:hover, .pagination a:active {
	border: 1px solid #428bca;
	color: #000;
	text-decoration: none;
}

.pagination span.current {
	padding: 2px 5px;
	margin: 2px;
	border: 1px solid #428bca;
	font-weight: bold;
	background-color: #428bca;
	color: #FFF;
}

.pagination span.disabled {
	padding: 2px 5px;
	margin: 2px;
	border: 1px solid #428bca;
	color: #ddd;
}
</style>
</head>
<body>
	<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
		<div class="container-fluid">
			<div class="navbar-header">
				<a class="navbar-brand" href="#">Content Center</a>
			</div>
			<div id="navbar" class="navbar-collapse collapse">
				<ul class="nav navbar-nav navbar-right">
					<li><a href="#">客户链接</a></li>
					<li><a href="#">公司网址</a></li>
					<li><a href="#">退出</a></li>
				</ul>
				<form class="navbar-form navbar-right">
					<select class="form-control">
						<option>全部内容范围</option>
						<option>WBT</option>
						<option>SBT</option>
						<option>拆装保养</option>
						<option>软教具</option>
						<option>试题</option>
						<option>测评</option>
						<option>其他</option>
					</select> <input type="text" class="form-control"
						placeholder="Search Content">
					<button type="submit" class="btn btn-default">搜索</button>
				</form>
			</div>
		</div>
	</nav>

	<div class="container-fluid">
     <div class="row">
        <div class="col-sm-3 col-md-2 sidebar">
          <ul class="nav nav-sidebar">
            <li><a href="../main.html">首页</a></li>
          </ul>
          <ul class="nav nav-sidebar">
              <li ><a href="../domain-index.html">域管理</a></li>
          </ul>
          <ul class="nav nav-sidebar">
          	<li><a href="../tag/tag-index.html">标签管理</a></li>
            <li><a href="../wbtSBT.html">课程库</a></li>
            <li><a href="../question/question-bank-index.html">题库</a></li>
            <li><a href="../groupTitle.html">测评库</a></li>
          </ul>
          <ul class="nav nav-sidebar">
            <li><a href="../statistics/statistics-index.html">数据统计</a></li>
          </ul>
          <ul class="nav nav-sidebar">
            <li   class="active"><a href="../account/account-index.html">账号管理</a></li>
          </ul>
		  <ul class="nav nav-sidebar">
            <li><a href="../knowledge-system.html">知识体系</a></li>
          </ul>
        </div>

			<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
				<div class="row">
					<ol class="breadcrumb">
						<li><a href="../main.html">首页</a></li>
						<li class="active">账号管理</li>
					</ol>
				</div>
				<div class="btn-toolbar" role="toolbar">
					<div class="btn-group">
						<button type="button" class="btn btn-info" data-toggle="modal"
							data-target="#accountAdd">新增</button>
						<!--<button type="button" class="btn btn-info">修改</button>-->
						<button type="button" class="btn btn-info" data-toggle="modal"
							data-target="#accountDelete">删除</button>

					</div>
					<div class="btn-group" style="float: right; padding-right: 60px;">
						<input class="form-control" value="xx" name="inname" type="text"
							value="" placeholder="请输入搜索关键字" style="background: #fff" /> <input
							name="accateid" type="hidden" id="accateid" value="" />
						<button type="button" class="btn btn-info"
							style="position: absolute; right: 0px; top: 0px;">搜索</button>
					</div>

					<!-- 
			 <div class="btn-group">
		  		<button type="button" class="btn btn-primary">启用</button>
		  		<button type="button" class="btn btn-primary">禁用</button>
		  	</div>
					
			 -->
				</div>

				<div class="table-responsive">
					<table class="table">
						<thead>
							<tr>
								<th><input type="checkbox" class="Js-hhj-account-select-all"></th>
								<th>序号</th>
								<th>编号</th>
								<th>账号</th>
								<th>邮箱</th>
								<th>使用状态</th>
								<th>操作</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td><input type="checkbox"></td>
								<td>12-25</td>
								<td>32</td>
								<td>86</td>
								<td>15</td>
								<td>正常</td>
								<td>
									<button type="button" class="btn btn-primary btn-xs" data-toggle="modal" data-target="#accountEdit">编辑</button>
									<button type="button" class="btn btn-primary btn-xs Js-hhj-account-enable">禁用</button>
								</td>
							</tr>
							<tr>
								<td><input type="checkbox"></td>
								<td>12-24</td>
								<td>32</td>
								<td>86</td>
								<td>15</td>
								<td>正常</td>
								<td>
									<button type="button" class="btn btn-primary btn-xs">编辑</button>
									<button type="button" class="btn btn-primary btn-xs Js-hhj-account-enable">禁用</button>
								</td>
							</tr>
							<tr>
								<td><input type="checkbox"></td>
								<td>12-23</td>
								<td>32</td>
								<td>86</td>
								<td>15</td>
								<td>正常</td>
								<td>
									<button type="button" class="btn btn-primary btn-xs">编辑</button>
									<button type="button" class="btn btn-primary btn-xs Js-hhj-account-enable">禁用</button>
								</td>
							</tr>
							<tr>
								<td><input type="checkbox"></td>
								<td>12-22</td>
								<td>32</td>
								<td>86</td>
								<td>15</td>
								<td>正常</td>
								<td>
									<button type="button" class="btn btn-primary btn-xs">编辑</button>
									<button type="button" class="btn btn-primary btn-xs Js-hhj-account-enable">禁用</button>
								</td>
							</tr>
							<tr>
								<td><input type="checkbox"></td>
								<td>12-21</td>
								<td>32</td>
								<td>86</td>
								<td>15</td>
								<td>正常</td>
								<td>
									<button type="button" class="btn btn-primary btn-xs">编辑</button>
									<button type="button" class="btn btn-primary btn-xs Js-hhj-account-enable">禁用</button>
								</td>
							</tr>
							<tr>
								<td><input type="checkbox"></td>
								<td>12-20</td>
								<td>32</td>
								<td>15</td>
								<td>16</td>
								<td>正常</td>
								<td>
									<button type="button" class="btn btn-primary btn-xs">编辑</button>
									<button type="button" class="btn btn-primary btn-xs Js-hhj-account-enable">禁用</button>
								</td>
							</tr>
							<tr>
								<td><input type="checkbox"></td>
								<td>12-19</td>
								<td>32</td>
								<td>15</td>
								<td>16</td>
								<td>正常</td>
								<td>
									<button type="button" class="btn btn-primary btn-xs">编辑</button>
									<button type="button" class="btn btn-primary btn-xs Js-hhj-account-enable">禁用</button>
								</td>
							</tr>
							<tr>
								<td><input type="checkbox"></td>
								<td>12-18</td>
								<td>32</td>
								<td>86</td>
								<td>15</td>
								<td>正常</td>
								<td>
									<button type="button" class="btn btn-primary btn-xs">编辑</button>
									<button type="button" class="btn btn-primary btn-xs Js-hhj-account-enable">禁用</button>
								</td>
							</tr>
							<tr>
								<table class="table table-striped">

									<div class="pagination">
										<form method="post" action="./articleList" name="qPagerForm">
											<input type="hidden" name="currentPage" value="1" /> &nbsp;共
											<strong>897</strong>项, <strong>113</strong>页:&nbsp; <span
												class="disabled">&laquo;&nbsp;上一页</span> <span
												class="current">1</span> <a
												href="javascript:turnOverPage(2)">2</a> &hellip; <a
												href="javascript:turnOverPage(112)">112</a> <a
												href="javascript:turnOverPage(113)">113</a> <a
												href="javascript:turnOverPage(2)">下一页&nbsp;&raquo;</a>
										</form>
										<script language="javascript">
											function turnOverPage(no) {
												if (no > 113) {
													no = 113;
												}
												if (no < 1) {
													no = 1;
												}
												document.qPagerForm.currentPage.value = no;
												document.qPagerForm.submit();
											}
										</script>
									</div>
								</table>
							</tr>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>
	<!--新曾窗口开始-->
	<div class="modal fade" id="accountAdd" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
					</button>
					<h4 class="modal-title" id="myModalLabel">新增账户</h4>
				</div>
				<div class="modal-body">
					<div id="passwordDiv" class="form-group has-feedback">
						<label class="control-label" for="password">邮箱：</label> 
						<div class="input-group">
						<input type="text" class="form-control" id="password" placeholder="请输入邮箱"> 
				        <span class="input-group-btn">
				        	<button class="btn btn-default" type="button">验证信息</button>
				        </span>
				        </div>
					</div>
					<div id="passwordDiv" class="form-group has-feedback">
						<label class="control-label" for="password">账号：</label> 
						<input type="text" class="form-control" id="password" placeholder="" readonly="readonly"> <span id="passwordSpan"
							class="glyphicon form-control-feedback"></span>
					</div>
					<div id="passwordDiv" class="form-group has-feedback">
						<label class="control-label" for="password">手机：</label> 
						<input type="text" class="form-control" id="password" placeholder="" readonly="readonly"> 
						<span id="passwordSpan" class="glyphicon form-control-feedback"></span>
					</div>
					<div id="passwordDiv" class="form-group has-feedback">
						<label class="control-label" for="password">密码：</label> 
						<input type="password" class="form-control" id="password" placeholder="" readonly="readonly"> 
						<span id="passwordSpan" class="glyphicon form-control-feedback"></span>
					</div>
					<!-- <div id="passwordDiv" class="form-group has-feedback">
						<label class="control-label" for="password">账户类型：</label> 
						<div class="radio">
							<label>
								<input type="radio" name="accountType">企业用户&#12288;&#12288;
								<input type="radio" name="accountType">普通用户&#12288;&#12288;
								<input type="radio" name="accountType">小车匠管理员&#12288;&#12288;
							</label>
						</div>
						<span id="passwordSpan" class="glyphicon form-control-feedback"></span>
					</div> -->
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">
						关闭</button>
					<button type="button" class="btn btn-primary">提交</button>
				</div>
			</div>
		</div>
	</div>
	<!--新曾窗口结束-->

	<!--编辑窗口开始-->
	<div class="modal fade" id="accountEdit" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
					</button>
					<h4 class="modal-title" id="myModalLabel">编辑账号</h4>
				</div>
				<div class="modal-body">
					<div id="userNameDiv" class="form-group has-feedback">
						<label class="control-label" for="userName">序号：</label> <input
							type="text" class="form-control" id="userName" value="1" readonly="readonly">
						<span id="userNameSpan" class="glyphicon form-control-feedback"></span>
					</div>
					<div id="userNameDiv" class="form-group has-feedback">
						<label class="control-label" for="userName">编号：</label> <input
							type="text" class="form-control" id="userName" value="1">
						<span id="userNameSpan" class="glyphicon form-control-feedback"></span>
					</div>
					<div id="passwordDiv" class="form-group has-feedback">
						<label class="control-label" for="password">账号：</label> <input
							type="text" class="form-control" id="password" value="zhangsan" placeholder="请输入账号">
						<span id="passwordSpan" class="glyphicon form-control-feedback"></span>
					</div>
					<div id="passwordDiv" class="form-group has-feedback">
						<label class="control-label" for="password">邮箱：</label> <input
							type="text" class="form-control" id="password" value="zhangsan@126.com" placeholder="请输入邮箱">
						<span id="passwordSpan" class="glyphicon form-control-feedback"></span>
					</div>
					<div id="passwordDiv" class="form-group has-feedback">
						<label class="control-label" for="password">密码：</label> <input
							type="password" class="form-control" id="password" value="123456" placeholder="请输入密码">
						<span id="passwordSpan" class="glyphicon form-control-feedback"></span>
					</div>
					<div id="passwordDiv" class="form-group has-feedback">
						<label class="control-label" for="password">确认密码：</label> <input
							type="password" class="form-control" id="password" value="123456" placeholder="请确认密码">
						<span id="passwordSpan" class="glyphicon form-control-feedback"></span>
					</div>
					<!-- <div id="passwordDiv" class="form-group has-feedback">
						<label class="control-label" for="password">账户类型：</label> 
						<div class="radio">
							<label>
								<input type="radio" name="accountType">企业用户&#12288;&#12288;
								<input type="radio" name="accountType">普通用户&#12288;&#12288;
								<input type="radio" name="accountType">小车匠管理员&#12288;&#12288;
							</label>
						</div>
						<span id="passwordSpan" class="glyphicon form-control-feedback"></span>
					</div> -->
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">
						关闭</button>
					<button type="button" class="btn btn-primary">提交</button>
				</div>
			</div>
		</div>
	</div>
	<!--编辑窗口结束-->

	<!--删除窗口开始-->
	<div class="modal fade" id="accountDelete" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
					</button>
					<h4 class="modal-title" id="myModalLabel">您是否要删除数据：账号1</h4>
				</div>
				<div class="modal-body" align="center">

					<button type="button" class="btn btn-default" data-dismiss="modal">确定</button>
					<button type="button" class="btn btn-primary" data-dismiss="modal">取消</button>

				</div>
				<div class="modal-footer"></div>
			</div>
		</div>
	</div>
	<!--删除窗口结束-->
	<script src="../js/jquery-2.1.3.min.js"></script>
	<script src="../js/bootstrap.min.js"></script>
	<script type="text/javascript">
		$(document).on("click",".Js-hhj-account-enable",function(){
			var $thiz = $(this),
			$trParent = $thiz.parents("tr");
			if($thiz.text() == '启用') {
				$thiz.text('禁用');
				$trParent.find("input[type='checkbox']").removeAttr("disabled");
				$trParent.find("td:eq(5)").text("正常");
				$trParent.removeClass("active").removeAttr("style");
			} else {
				$thiz.text('启用');
				$trParent.find("input[type='checkbox']").prop("checked",false).attr("disabled","disabled");
				$trParent.find("td:eq(5)").text("禁用");
				$trParent.addClass("active").css("cursor","not-allowed");
			}
			
		});
		$(document).on("click",".Js-hhj-account-select-all",function(){
			var $thiz = $(this),
			$trParent = $thiz.parents(".table");
			if($thiz.is(":checked")) {
				$trParent.find("input[type='checkbox']:enabled").prop("checked",true);
			} else {
				$trParent.find("input[type='checkbox']:enabled").prop("checked",false);
			}
		});
		
	</script>
</body>
</html>
